
import './App.css';
import React, { useState } from 'react';
import './ArrowAnimation.css'


const MyApp = () => {
  const [isFlipped, setIsFlipped] = useState(false);

  const handleClick = () => {
    setIsFlipped(!isFlipped);
  };

  return (
    <div className="arrow-container" onClick={handleClick}>
      <img
        style={{ width: 50, height: 50 }}
        className={`arrow ${isFlipped ? 'flipped' : ''}`}
        src="./down2.png"
        alt="Arrow"
      />
    </div>
  );
};

export default MyApp;